<template>
	<div class="padding search-light">
		<div class="paramseter-box margin-bottom-lg radius-sm flex align-center" v-for="(item, index) in 5" :key="index">
			<div style="">
				<div class="text-lg text-black">铸流序号</div>
				<div class="text-center" style="font-size: 50px; color: #1B3CAB;">{{index + 1}}</div>
			</div>
			<div class="flex-sub">
				<lay-json-schema-form :model="formData" :schema="schema" :key="forKey"></lay-json-schema-form>
			</div>
		</div>
		<div class="margin-top-xl flex justify-end align-center">
			<el-button class="padding-lr-xl text-blue3 solid-blue" size="large" @click="closePopupFun">返回</el-button>
			<div class="margin-left-xxl">
				<el-button type="primary" class="btn-bg-blue btn-box padding-lr-xl" size="large">保存</el-button>
			</div>
		</div>
	</div>
</template>

<script setup>
	import { ref, onMounted } from 'vue';
	const emit = defineEmits(['closePopup']);
	
	const forKey = ref(new Date().getTime())
	
	//关闭弹出
	const closePopupFun = () => {
		emit('closePopup')
	}
	//表单数据
	const formData = ref({
		CardTypeCode: '', //
		CardTypeName: '', //
		CardTypeName3: '',
		CardTypeName4: '',
	});

	//表单配置
	const schema = ref({
		CardTypeCode: {
			label: '当前钢种',
			type: 'select',
			props: {
				showSearch: true, //开启搜索
				allowClear: true, //是否允许清空
				options: [{
					label: '42CrMo',
					value: '42CrMo',
				}],

				placeholder: '请选择当前钢种',
			},
			colProps: {
				md: 5,
			},
		},
		CardTypeName: {
			label: '当前新面',
			type: 'select',
			props: {
				showSearch: true, //开启搜索
				allowClear: true, //是否允许清空
				options: [{
					label: '0.53*0.41',
					value: '0.53*0.41',
				}],
				placeholder: '请选择当前新面',
			},
			colProps: {
				md: 5,
			},
		},
		CardTypeName3: {
			label: '当前切割定尺',
			type: 'select',
			props: {
				showSearch: true, //开启搜索
				allowClear: true, //是否允许清空
				options: [{
					label: '5',
					value: '5',
				}],
				placeholder: '请选择当前切割定尺',
			},
			colProps: {
				md: 5,
			},
		},
		CardTypeName4: {
			label: '当前配置同步到',
			type: 'select',
			props: {
				showSearch: true, //开启搜索
				allowClear: true, //是否允许清空
				options: [{
						label: '全部铸流',
						value: '全部铸流',
					},
					{
						label: '铸流1',
						value: '铸流1',
					}
				],
				placeholder: '请选择',
			},
			colProps: {
				md: 9,
			},
		},
	});
	
	onMounted(()=>{
		forKey.value = new Date().getTime()
	})
</script>

<style lang="scss" scoped>
	.paramseter-box {
		border: 1px solid #1B3CAB;
		padding: 30px 20px 0 30px;
	}
</style>